$(function () {

    let agent = getQueryString("agent");
    let onlineStatus = getQueryString("onlineStatus");

    let url = '../user/list?1=1';
    if (agent) {
        url += '&agent=' + agent;
    }
    if (onlineStatus) {
        url += '&onlineStatus=' + onlineStatus;
    }


    $("#jqGrid").jqGrid({
        url: url,
        datatype: "json",
        colModel: [
            {label: 'id', align: "center", name: 'id', index: 'id', key: true, hidden: true},
            {
                label: '昵称', align: "center", name: 'nickname', index: 'nickname', width: 80,
                formatter: cLink,
                editable: true
            },
            {label: '手机', align: "center", name: 'mobile', index: 'mobile', width: 80},

            {
                label: '性别', align: "center", name: 'gender', index: 'gender', width: 80, formatter: function (value) {
                    return transGender(value);
                }
            },
            {
                label: '出生日期', align: "center", name: 'birthday', index: 'birthday', width: 120,
                formatter: function (value) {
                    return transDate(value, 'yyyy-MM-dd hh:mm:ss');
                }
            },
            {
                label: '近一次登录时间', align: "center", name: 'lastLoginTime', index: 'last_login_time', width: 120,
                formatter: function (value) {
                    return transDate(value, 'yyyy-MM-dd hh:mm:ss');
                }
            },
            {label: '在线时长/天', align: "center", name: 'olinetime', index: 'olinetime', width: 80},
            {label: '聊天总时长/分钟', align: "center", name: 'talkTimes', index: 'talkTimes', width: 100},
            {label: '接单次数', align: "center", name: 'ordernum', index: 'ordernum', width: 80},
            {
                label: '头像', align: "center", name: 'avatar', index: 'avatar', width: 80, formatter: function (value) {
                    return transImg(value);
                }
            },
            {
                label: '状态', align: "center", name: 'status', index: 'status', width: 80
                , formatter: function (value) {
                    return transStatus(value);
                }
            }
        ],
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList: [10, 30, 50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth: true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader: {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames: {
            page: "page",
            rows: "limit",
            order: "order"
        },
        postData: {
            'applicationStatus': 3
        },
        gridComplete: function () {
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
        }
    });
});

function cLink(cellvalue, options, rowObject) {
    return '<a href="javascript:void(0)" onclick="getinfo(' + rowObject.id + ')">' + rowObject.nickname + '</a>';
}

function getinfo(id) {
    vm.showList = false;
    vm.showAvatar = true;
    vm.uploadList = [];

    vm.title = "修改";
    vm.getInfo(id);
    vm.getPics(id);
    vm.getAgentList();
}


let vm = new Vue({
        el: '#rrapp',
        data: {
            showList: true,
            title: null,
            apiUser: {},
            phone: "",
            uploadList: [],
            agentList: [],
            visible: false,
            showAvatar: false,
            avatar: '',
            ruleValidate:
                {
                    name: [
                        {required: true, message: '名称不能为空', trigger: 'blur'}
                    ]
                }
            ,
            q: {
                name: ''
            }
        },
        methods: {
            query: function () {
                vm.reload();
            }
            ,
            add: function () {
                vm.showList = false;
                vm.uploadList = [];
                vm.title = "新增";
                vm.apiUser = {};
                vm.avatar = '';
                vm.showAvatar = false;
            }
            ,
            update: function (event) {
                let id = getSelectedRow();
                if (id == null) {
                    return;
                }
                vm.showList = false;
                vm.phone = "";
                vm.showAvatar = true;
                vm.uploadList = [];
                vm.agentList = [];

                vm.title = "修改";
                vm.getInfo(id);
                vm.getPics(id);
                vm.getAgentList();

            },
            saveOrUpdate: function (event) {
                let url = vm.apiUser.id == null ? "../user/save" : "../user/update";
                vm.apiUser.pics = vm.uploadList;

                $.ajax({
                    type: "POST",
                    url: url,
                    contentType: "application/json",
                    data: JSON.stringify(vm.apiUser),
                    success: function (r) {
                        if (r.code === 0) {
                            alert('操作成功', function (index) {
                                vm.reload();
                            });
                        } else {
                            alert(r.msg);
                        }
                    }
                });
            }
            ,
            getAgentList: function () {
                $.get("../user/listAgent", function (r) {
                    vm.agentList = r.list;
                });
            },
            getPics: function (id) {//获取商品顶部轮播图
                $.get("../user/audlting/" + id, function (r) {
                    vm.uploadList = r.picList;
                });
            }
            ,
            del: function (event) {
                let ids = getSelectedRows();
                if (ids == null) {
                    return;
                }

                confirm('确定要删除选中的记录？', function () {
                    $.ajax({
                        type: "POST",
                        url: "../user/delete",
                        contentType: "application/json",
                        data: JSON.stringify(ids),
                        success: function (r) {
                            if (r.code == 0) {
                                alert('操作成功', function (index) {
                                    $("#jqGrid").trigger("reloadGrid");
                                });
                            } else {
                                alert(r.msg);
                            }
                        }
                    });
                });
            }
            ,
            getInfo: function (id) {
                $.get("../user/info/" + id, function (r) {
                    vm.apiUser = r.apiUser;
                    vm.avatar = 'https://www.qutuiya.com/' + r.apiUser.avatar;
                    vm.phone = r.phone;
                });
            },

            suspend: function (event) {
                let id = getSelectedRow();
                if (id == null) {
                    return;
                }
                confirm('确定要封选中主播状态？', function () {
                    $.ajax({
                        type: "POST",
                        url: "../user/suspend",
                        contentType: "application/json",
                        data: JSON.stringify(id),
                        success: function (r) {
                            if (r.code == 0) {
                                alert('操作成功', function (index) {
                                    $("#jqGrid").trigger("reloadGrid");
                                });
                            } else {
                                alert(r.msg);
                            }
                        }
                    });
                });
            },
            unsuspend: function (event) {
                let id = getSelectedRow();
                if (id == null) {
                    return;
                }
                confirm('确定要解封选中主播状态？', function () {
                    $.ajax({
                        type: "POST",
                        url: "../user/unsuspend",
                        contentType: "application/json",
                        data: JSON.stringify(id),
                        success: function (r) {
                            if (r.code == 0) {
                                alert('操作成功', function (index) {
                                    $("#jqGrid").trigger("reloadGrid");
                                });
                            } else {
                                alert(r.msg);
                            }
                        }
                    });
                });
            },
            comment: function (event) {
                let id = getSelectedRow();
                if (id == null) {
                    return;
                }
                confirm('确定要查看主播评论？', function () {
                    $.ajax({
                        type: "POST",
                        url: "../user/unsuspend",
                        contentType: "application/json",
                        data: JSON.stringify(id),
                        success: function (r) {
                            if (r.code == 0) {
                                alert('操作成功', function (index) {
                                    $("#jqGrid").trigger("reloadGrid");
                                });
                            } else {
                                alert(r.msg);
                            }
                        }
                    });
                });
            },
            reload: function (event) {
                vm.showList = true;
                let page = $("#jqGrid").jqGrid('getGridParam', 'page');
                $("#jqGrid").jqGrid('setGridParam', {
                    postData: {
                        'name': vm.q.name
                    },
                    page: page
                }).trigger("reloadGrid");
                vm.handleReset('formValidate');
            }
            ,
            handleSubmit: function (name) {
                handleSubmitValidate(this, name, function () {
                    vm.saveOrUpdate()
                });
            }
            ,
            handleReset: function (name) {
                handleResetForm(this, name);
            }
            ,
            handleSuccessAvatar: function (res, file) {
                vm.showAvatar = true;
                vm.apiUser.avatar = file.response.data.url;
                vm.avatar = 'https://www.qutuiya.com/' + file.response.data.url;
            }
            ,
            handleFormatError: function (file) {
                this.$Notice.warning({
                    title: '文件格式不正确',
                    desc: '文件 ' + file.name + ' 格式不正确，请上传 jpg 或 png 格式的图片。'
                });
            }
            ,
            handleMaxSize: function (file) {
                this.$Notice.warning({
                    title: '超出文件大小限制',
                    desc: '文件 ' + file.name + ' 太大，不能超过 2M。'
                });
            }
            ,
            eyeImageAvatar: function () {
                var url = vm.apiUser.avatar;
                console.log(url)
                eyeImage(url);
            }
            ,
            handleRemove(file) {
                // 从 upload 实例删除数据
                const fileList = this.uploadList;
                this.uploadList.splice(fileList.indexOf(file), 1);
            }
            ,
            handleSuccess(res, file) {
                // 因为上传过程为实例，这里模拟添加 url
                file.id = res.data.id;
                file.url = res.data.url;
                vm.uploadList.add(file);
            }
            ,
            handleBeforeUpload() {
                const check = this.uploadList.length < 5;
                if (!check) {
                    this.$Notice.warning({
                        title: '最多只能上传 5 张图片。'
                    });
                }
                return check;
            }
            ,
            handleView(name) {
                this.imgName = name;
                this.visible = true;
            }
            ,
        }
        ,
        mounted() {
            this.uploadList = this.$refs.upload.fileList;
        }
    })
;